<!doctype html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="UTF-8">
	<title>主页</title>
	
	<link rel="stylesheet" type="text/css" href="/static/css/resources/bootstrap.min.css"/>
	<link rel="stylesheet" type="text/css" href="/static/css/stylesheets/index.css"/>
	<script type="text/javascript" src="/static/js/resources/jquery.min.js"></script>
	<script src="/static/js/resources/bootstrap.min.js"></script>
	<script src="/static/js/resources/bootstrapValidator.js"></script>
	
	
	<script type="text/javascript" src="/resources/ueditor.config.js"></script>
	<script type="text/javascript" src="/resources/ueditor.all.js"></script>

</head>
<body>

<div class="nav" th:include="pages/admin/common/nav :: nav"></div>

<div class="container-box">
	<div class="col-md-8 cont-left">
		<div class="fri-news" id="fri-news" th:each="user : ${userPage.getContent()}">
			<div class="news-item">
				<div class="item-top">
					<div class="user-head">
						<img th:src="${user.getImgUrl()}" class="head-img"/>

					</div>
					<div class="item-info">
						<span th:text="${user.getStatusZn()}"></span>
						<div class="btn-group status-button" th:attr="data-status=${user.getStatus()}">
							<button th:attr="data-id=${user.getId()}" data-status="freeze"
											type="button" class="btn btn-default">冻结
							</button>
							<button th:attr="data-id=${user.getId()}" data-status="normal"
											type="button" class="btn btn-success">正常
							</button>
						</div>
						<div class="user-name"><p th:text="'昵称 :' + ${user.getNickname()}"></p>
							<p th:text="'邮箱：' + ${user.getEmail()}"></p>
						<p th:text="'性别：' + ${user.getSex()}"></p>
						<p th:text="'个人简介：' + ${user.getResume()}"></p></div>
						<div class="create-time" th:text="'注册时间：'+${#dates.format(user.getCreateTime(),'yyyy-MM-dd HH:mm:ss')}">
						</div>
						
					</div>
				</div>
			</div>
		</div>
		<ul class="pagination">
			<li th:unless="${userPage.getNumber()} == 0">
				<a th:href="'/admin/userList?page=' + ${userPage.getNumber()} +'&&status=' + ${param.status!=null?param.status[0]:'all'}">&laquo;</a>
			</li>
			<li>
				<a href="javascript:;">当前页面 第<span th:text="${userPage.getNumber()+1} "></span>页</a></li>
			<li th:unless="${userPage.getNumber()} == ${userPage.getTotalPages() -1}">
				<a th:href="'/admin/userList?page=' + ${userPage.getNumber() + 2} +'&&status=' + ${param.status!=null?param.status[0]:'all'}">&raquo;</a>
			</li>
			<li>
				<a href="javascript:;">共 <span th:text="${userPage.getTotalPages()}"></span>页</a>
			</li>
			<li class="goto">
				<a>
					<form action="/admin/userList" method="get">
						<span>跳转至</span>
						<input onkeyup="value=value.replace(/[^\d]/g,'')"  min="0" th:max="${userPage.getTotalPages()}" type="number" name="page">
						<input class="hide" type="text" name="status" th:value="${param.status!=null?param.status[0]:'all'}">
						<span>页</span>
						<button type="submit">确认跳转</button>
					</form>
				</a>
			</li>
		</ul>
	</div>

	<div class="col-md-4 cont-rit" th:include="pages/admin/common/right-nav :: right">
	</div>
</div>

<!--返回顶部-->
<a href="javascript:void(0);" id="to-top" class="to-top">
	<span class="glyphicon glyphicon-arrow-up top-icon"></span>
</a>


<script type="text/javascript">
	$(function () {
		var buttonDiv = $('div.status-button');
		var button = buttonDiv.find('button');
		button.bind('click', function () {
			var _this = $(this);
			var id = _this.attr('data-id');
			var status = _this.attr('data-status');
			$.ajax({
				url: '/admin/setUserStatus',
				data: {
					'id': id,
					'status': status
				},
				type: 'POST',
				success: function (data) {
					var result = $.parseJSON(data);
					console.info(result);
					var isSuccess = result.isSuccess;
					if (isSuccess) {
						_this.parent().parent().find('span').text(result.other)
					}
					else {
						alert(result.reason);
					}
				}
			});
		});
	});
	/*返回顶部*/
	$(function () {
		var to_top = $("a#to-top"),
				body = $("body,html"),
				body_scrolltop = body.scrollTop(),
				isTop = true;

		if (body_scrolltop > 0) {
			to_top.show();
		}
		else {
			to_top.hide();
		}

		to_top.bind("click", function () {
			body.animate({scrollTop: 0}, 200);
			to_top.hide(0, function () {

			});
		});

		$(window).scroll(function () {
			var body_scrolltop = body.scrollTop();

			if (body_scrolltop > 0 && isTop == true) {
				isTop = false;
				to_top.fadeIn(200);
			}
			else if (body_scrolltop <= 0) {
				isTop = true;
				to_top.fadeOut(200);
			}
		});
	});
</script>

</body>
</html>